<template>
  <!-- 项目分包-外协单位新增 5-4 -->
  <div class="common-wrap">
    <h3>开票到账信息</h3>
    <a-form :form="form">
      <a-form-item label="编号" :label-col="{ span: 2 }" >
        <a-input size="large" placeholder="请输入编号" v-decorator="[
          '编号',
          {rules: [{ required: true, message: '请输入编号' }]}
        ]" />
      </a-form-item>
      <a-form-item label="开票代码" :label-col="{ span: 2 }">
        <a-input size="large" placeholder="请输入开票代码" />
      </a-form-item>
      <a-form-item label="发票号码" :label-col="{ span: 2 }">
        <a-input size="large" placeholder="请输入发票号码" />
      </a-form-item>
      <a-form-item label="开票时间" :label-col="{ span: 2 }">
        <a-date-picker size="large" placeholder="请选择开票时间" :showToday="false" />
      </a-form-item>
      <a-form-item label="开票金额" :label-col="{ span: 2 }">
        <a-input size="large" placeholder="请输入开票金额" />
      </a-form-item>
      <a-form-item label="开票时间" :label-col="{ span: 2 }">
        <a-date-picker size="large" placeholder="请选择开票时间" :showToday="false" style="width:293px" />
      </a-form-item>
      <a-form-item label="到账金额" :label-col="{ span: 2 }">
        <a-input size="large" placeholder="请输入到账金额" />
      </a-form-item>
      <a-form-item label="应收账款" :label-col="{ span: 2 }">
        <a-input size="large" placeholder="请输入应收账款" />
      </a-form-item>
      <a-form-item>
        <div class="sumbitButton">
          <a-button type="primary" class="buttonColorGreen" size="large">提交</a-button>
          <a-button class="buttonColorWhite" size="large">取消</a-button>
        </div>
      </a-form-item>
    </a-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: this.$form.createForm(this)
    }
  }
}
</script>

<style>
h3{
  margin-bottom: 25px;
}
.ant-input {
  width: 300px;
}
.sumbitButton {
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
}
.sumbitButton button {
  margin: 20px 30px;
}
</style>

